<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>点击</button>
    <button>点击</button>
    <button>点击</button>
    <script>
        //bind()方法不会调用函数，但是能改变函数内部的this指向
        //语法: fun.bind(thisArg,arg1,arg2,....)
        //thisArg ：在fun函数运行时指定的this值
        //arg1，arg2：传递的其他参数
        //返回由指定的this值和初始化参数改造的原函数拷贝
        var o ={
            name:'andy'
        };
        function fn(a,b){
            console.log(this);
            console.log(a+b);
        };
        var f = fn.bind(o,1,2);//bind()方法不会调用函数，但是能改变函数内部的this指向
        f();//返回由指定的this值和初始化参数改造的原函数拷贝

        //如果有的函数我们不需要立即调用，又想改变函数内部的this指向，用bind()最合适
        //我们有一个按钮，当我们点击了之后，就禁用这个按钮，3秒之后开启这个按钮
        // var btn = document.querySelector("button");
        // btn.addEventListener('click',function(){
        //     // var that = this;
        //     this.disabled = true;
        //     setTimeout(function(){
        //         //定时器函数里面的this指向的是window
        //     //    that.disabled = false;
        //         this.disabled = false;
        //     }.bind(this),3000)
        // })
            var btns = document.querySelectorAll("button");
            for(var i =0 ; i < btns.length;i++){
                btns[i].onclick = function(){
                // var that = this;
                this.disabled = true;
                setTimeout(function(){
                    //定时器函数里面的this指向的是window
                //    that.disabled = false;
                    this.disabled = false;
                }.bind(this),3000)
            }
            }
    </script>
</body>
</html>